<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>03_元素属性操作</title>
		<!-- 元素  固定属性---清楚 ：元素是否可用属性【w3c元素出现设置属性】
		        附加属性----清楚：表单为主，附加属性checked、disabled...
				prop()  ---功能与attr类似，附加属性，针对表单，默认选中
				removeProp()  ---功能：与removeAttr类似，附加属性，针对表单，移除选中
		 -->
		 <!-- 复选框 默认选中  id="myCheckBox"
		      三个按钮    id="getPropBtn"       获取属性
		 	            id="setPropBtn"       设置属性
		 				id="removePropBtn"    移除属性
		 弹出显示文字 div id="output"
		 -->
		 <script src="../js/jquery-1.11.1.js"></script>
	</head>
	<body>
		<h1>prop()和removeProp()函数使用</h1>
		<input type="checkbox" id="myCheckBox" checked />
		<button id="getProBtn">获取属性</button>
		<button id="setProBtn">设置属性</button>
		<button id="removeProBtn">移除属性</button>
		<div id="output">
			
		</div>
		<script>
			/*prop()  点击---获取属性---打印复选框的值
			                        复选框的值是：+变量
			prop()---input元素--checked属性--属性值bool[true,false]						
			*/
		   $("#getProBtn").click(function(){
			   //prop()获取元素的附加属性--input中checked
			   var isChecked=$("#myCheckBox").prop("checked")
			   $("#output").text("复选框的值是："+isChecked);
		   });
		   // prop("checked",false)  取消选中
		   $("#setProBtn").click(function(){
		   $("#myCheckBox").prop("checked",false)
		   $("#output").text("复选框的值是：false");
		   });
		   //removeProp("checked")  取消选中--删除  checked属性
		   $("#removeProBtn").click(function(){
		   $("#myCheckBox").prop("checked")
		   $("#output").text("复选框的属性已经移除");
		   });
		</script>
	</body>
</html>